body {
    font: 62.5%/1.3846 arial,helvetica,clean,sans-serif;
    background-color: #ccc;
}

h1, h2 {
    color: #985735;
    background-color: #fafafa;
    border-top: .2em solid #f7f7f7;
    border-bottom: .2em solid #f7f7f7;
    padding-top: .3em;
    padding-bottom: .3em;
    padding-left: 13px;
}

.notebook {
    min-width: 800px;
    max-width: 1024px;
    width: 100%;
    clear: both;
    /* margin: 0 auto; */
    margin-left: 8%;
    overflow: hidden;
    font-size: 1.3em;
    padding: 25px;
    width: 98.9999%;
    box-shadow: 0.4em 0.4em 0.5em rgb(0 0 0 / 30%);
    margin-right: 1%;
    float: left;
    background-color: #fff;
    overflow: hidden;
    border: 1px solid rgb(155, 155, 155);
}


.output {
    color: indianred;
    font-family: consolas;
    font-size: 10;
    background-color: rgb(245, 245, 245);
    padding: 5px;
    max-width: 67.5%;
    overflow-y: auto;
}

.output-image {
    width: 90%;
}

.code-input {
    color: rgb(2, 41, 43);
    max-width: 65%;
    position: relative;
    background-color: #e1f3f8;
    border-left: 8px solid #02bfe7;
    padding: 5px 5px 5px 10px;
    font-family: consolas;
    font-size: 10;
}

blockquote {
    background-color: rgb(241, 241, 241);
    color: rgb(2, 41, 43);
    max-width: 65%;
    position: relative;
    margin-left: 0%;
    border-left: 8px solid #985735;
    padding: 5px 5px 5px 10px;
    font-family: consolas;
    font-size: 10;
}

.code {
    background-color: lightgoldenrodyellow;
}

table, thead {
    border-collapse:collapse; 
    border:solid #000000; 
    border-width:2px 0 2px 0px; 
    min-width: 350px;
}

td {
    padding: 1% 1% 1% 2.5%;
}